<template>
	<view>
		
		
		<view class="goodsbox">
			
			<view class="goods_select">
				
				<view class="goods_select_in">
					
					<text class="icon-sousuo iconfont"></text> 
					<input  confirm-type="search" @confirm="selectland" placeholder="请输入" />
					
				</view>
				
			</view>
			
			<view class="goods_show">
				
				<view class="goods_showli" @tap="seegoodsinfo" :data-id="item.id" v-for="item in lists">
					<image :src="item.image" mode="aspectFill"></image>
					<view class="goods_showli_title font1">{{item.name}}</view>
					<view class="goods_showli_desc font2">{{item.desc}}</view>
					<view class="goods_showli_money">
						<view class="goods_showli_money1"> ¥ {{item.money}}</view>
						<view class="goods_showli_money2 font1"> {{item.extensive}} </view>
					</view>
				</view>
				
				
			</view>
			
			
			<view style="height: 20rpx;"></view>
		</view>
		
		
	</view>
</template>

<script>
	import {curl} from 'common/api.js';
	export default {
		data() {
			return {
				lists:[]
			}
		},
		
		onShow() {
			this.getindexshowbycity('');
		},
		
		onShareAppMessage(res) {
			
		},
		methods: {
			seegoodsinfo(ret){
				console.log('调整地址',ret);
				var id=ret.currentTarget.dataset.id;
				uni.navigateTo({
					url:'/pages/index/info?id='+id
				})
			},
			selectland(ret){
				var title=ret.detail.value;
				
				this.getindexshowbycity(title);
			},
			
			//获取首页推荐
			getindexshowbycity(title){
				
				var that=this;
				curl('index/getindexshowbytitle', {title:title}).then((res) => {
					console.log('首页推荐',res.data);
					that.lists=res.data
				});
				
				
			}
		}
	}
</script>

<style>
	.goods_select_in>text{
			margin-left: 30rpx;line-height: 60rpx;
			width: 50rpx;color: #666666;
		}
		
		.goods_select_in>input{
			line-height: 60rpx;
			width: 500rpx;
		}
		.goods_select_in{
			width: 650rpx;height: 60rpx;margin: 15rpx auto;
			display: flex;align-items: center;
			background: #fafafa;border-radius: 90rpx;
		}
		.goods_select{
			width: 700rpx;height: 90rpx;margin:  auto;
			border: 1px solid transparent;
		}
	
/* 210 */
	.goods_showli_money2{
		width: 130rpx;color: #646464;height: 60rpx;line-height: 50rpx;
		font-weight: 500;font-size: 24rpx;
		text-align: right;
	}
	.goods_showli_money1{
		width: 180rpx;color: #f14a27;height: 60rpx;line-height: 50rpx;
		font-weight: bold;font-size: 28rpx;
	}
	.goods_showli_money{
		width: 320rpx;height:60rpx;margin: auto;
		display: flex;align-items: center;justify-content: space-around;
	}
	.goods_showli_desc{
		width: 320rpx;height:90rpx;margin: auto;
		font-size: 28rpx;font-weight: 500;line-height: 40rpx;
	}
	.goods_showli_title{
		width: 320rpx;height:60rpx;margin: auto;
		font-size: 30rpx;font-weight: bold;line-height: 60rpx;
	}
	.goods_showli>image{
		width: 335rpx;height: 335rpx;
		border-radius: 10rpx 10rpx 0px 0px ;
	}
	
	.goods_showli{
		width: 335rpx;height:550rpx;margin: 10rpx;
		background: #ffffff;border-radius: 10rpx;
	}
	.goods_show{
		width: 710rpx;height: auto;margin: auto;
		display: flex;
		flex-wrap: wrap;
	
	}
	
	.goods_title>text{
		font-size: 32rpx !important;font-weight: bold !important;
		margin-right: 5rpx;
	}
	.goods_title{
		width: 710rpx;height: 90rpx;margin: auto;
		display: flex;align-items: center;
		font-size: 28rpx !important;font-weight: 600 !important;
	}
	.goodsbox{
		width: 100%;min-height:100vh;
		background-color: #b8ffdd;
		background-image: linear-gradient(180deg, #b8ffdd 0%, #c8ffdb 33%, #f4f4f4 66%, #f4f4f4 100%);
	}
	.menuboxli_tit{
		width: 167rpx;height: 67rpx;
		text-align: center;line-height: 47rpx;font-size: 24rpx;font-weight: bold;
	}
	.menuboxli>image{
		width: 100rpx;height: 100rpx;border-radius: 10rpx;
	}
	.menuboxli{
		width:167rpx;height: 167rpx;margin: 5rpx;
		text-align: center;
	}
	
	.menubox{
		width: 710rpx;height: auto;margin:auto;
		display: flex;flex-wrap: wrap;
	}
	swiper-item,swiper-item>image{
		width: 700rpx;height: 350rpx;border-radius: 10rpx;
	}
	.swiper{
		width: 700rpx;height: 350rpx;margin: 30rpx auto;
		
	}
	.bannerbox{
		width: 100%;height: 400rpx;
		border-radius: 30rpx 30rpx 0rpx 0rpx ;margin-top: -20rpx;
		background: #ffffff;position: absolute;z-index: 99;
	}
	.selectbox_q>view{
		height: 40rpx;line-height: 50rpx;
		font-size: 24rpx;color: #ffffff;
	}
	.selectbox_q>text{
		font-size: 32rpx;color: #ffffff;display: block;
	}
	.selectbox_q{
		width: 150rpx;margin-left: 40rpx;
		white-space: 90rpx;text-align: center;
	}
	.selectbox_input>text{
		font-size: 28rpx !important;margin-right: 10rpx;
	}
	.selectbox_input{
		height: 70rpx;width: 520rpx;color: #ececec;
		display: flex;align-items: center;text-indent: 20rpx;
		font-size: 28rpx;
		border-radius: 70rpx;background: #08964c;
	}
	.navBar{
		width: 710rpx;margin: auto;
		display: flex;align-items: center;
	}
	
	.address{
		font-size: 28rpx;font-weight: bold;
		color: white;
		display: flex;align-items: center;
	}
	.address>text{
		font-size: 28rpx !important;margin-right: 5rpx;
	}
	.navBarBox{
		width: 100%;height: auto;background: #08b059;
	}
	
	.selectbox{
		width: 700rpx;height: 120rpx;margin: auto;
		display: flex;align-items: center;justify-content: space-around;
	}
</style>
